/*
 * 组件注释
 * @Author: wuq-l
 * @Date: 2022-09-05 17:22:34
 * @LastEditors: wuq-l
 * @LastEditTime: 2023-01-13 09:42:18
 * @Description: 点击按钮弹出来的拉下框
 * 既往不恋！当下不杂！未来不迎！！！
 */
"use strict";
import { Link } from "umi";
import { Dropdown, Modal } from "antd";
import type { MenuProps } from 'antd';
import { AppstoreFilled, ExclamationCircleOutlined } from "@ant-design/icons";

interface Iitem {
  type: string;
  label: string;
  href?: string;
  link?: string;
  [key: string]: any;
}
type MenuItem = Required<MenuProps>["items"][number];

const customMenuItem = (btns: Iitem[]): MenuProps['items'] => {
  return btns.map((item: Iitem, index: number) => {
    const { type, event, label, href, link, ...args } = item;

    let menuItem = {
      className: "dropdown-item",
      label: label,
      ...args,
    } as MenuItem;

    if (args.disabled) {
      return menuItem as MenuItem;
    }

    switch (type) {
      case "delete":
      case "cancel":
        return {
          ...menuItem,
          onClick: ({ domEvent }) => {
            domEvent.stopPropagation();
            Modal.confirm({
              title: `确认${label}？${label}后不可恢复！`,
              icon: <ExclamationCircleOutlined />,
              okText: "确认",
              cancelText: "取消",
              onOk: event,
            });
          }
        } as MenuItem;
      case "export":
        return {
          ...menuItem,
          onClick: ({ domEvent }: { domEvent: any }) => {
            domEvent.stopPropagation()
            const a: any = document.createElement("a")
            a.target = "_blank";
            a.herf = href;
            a.click()
          }
        } as unknown as MenuItem;
      default:
        const events = {
          ...(event
            ? { onClick: ({ domEvent }: { domEvent: any }) => event(domEvent) }
            : {}),
        };

        return {
          ...menuItem,
          ...events,
          label: link ? <Link to={link}>{label}</Link> : label,
        } as MenuItem;
    }
  });
};
const Index = ({ btns }: { btns: Iitem[] }) => {
  const items: MenuProps['items'] = customMenuItem(btns)
  return (
    <Dropdown menu={{ items }}>
      <a className="ant-dropdown-link" onClick={e => e.preventDefault()}>
        <AppstoreFilled />
      </a>
    </Dropdown>
  );
};
export default Index;
